---
comments: false
---

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, user-scalable=no">
    <script src="https://cdn.jsdelivr.net/npm/yitizi@0.1.1"></script>
    <title>异体字</title>
    <style>
         #searchResultsContainer {
            display: flex;
            font-size: x-large;
            /* align-items: center;
            justify-content: center; */
            margin-top: 20px;
        }
        #more {
          text-align: right;
          font-size: small;
        }
        #backButton {
          background-image: url('images/back.png');
          width: 20px;
          height: 20px;
          background-size: cover;
          cursor: pointer;
          /* background-color: #666; */
      }
    </style>
</head>
<body>

   <div id="backButton" ></div>
    <main class="main">
        <div id="search">
            <form class="search-form" action="javascript:return true" autocomplete="off" onsubmit="return false;">
                <div class="search-input">
                    <input maxlength="80" type="search" class="search-input" id="search-input" placeholder="请输入关键字..." required="">
                </div>
            </form>
        </div>
    <script>var searchDataFile = "/search.json";</script>
    <script defer="" src="/js/local-search.js"></script>
    </main>
  
    <div id="searchResultsContainer">
        <div id="searchResults"></div>
    </div>

    <div id="more">
      <a href="https://jf.xmu.edu.cn/variants.html">没查到？试试这个</a>
    </div>
    <script>

var postTitle = document.querySelector('.post-title');
    postTitle.style.display = 'none';
    var headeRight = document.querySelector('.header__right');
    headeRight.style.display = 'none';
    var headeLeft = document.querySelector('.header__left');
    headeLeft.style.display = 'none';

      
        var elements = document.querySelector('.post-title__text');
        elements.textContent = '异体字查询'
        function search() {
            var inputText = document.getElementById("searchInput").value;
            var searchResults = Yitizi.get(inputText); // Call the get method on the Yitizi object
            var resultsDiv = document.getElementById("searchResults");
            resultsDiv.innerHTML = searchResults; // Set the search results as HTML content
        }
        // 监听搜索输入框
    document.addEventListener('DOMContentLoaded', function() {
      var inputElement = document.getElementById('search-input');
      inputElement.value = '';
      inputElement.addEventListener('input', function(event) {
        // 实时获取输入框中的内容
        var inputValue = inputElement.value;
        console.log('输入内容为: ' + inputValue);
      });

      inputElement.addEventListener('keyup', function(event) {
        if (event.key === 'Enter') {
          // 用户按下了回车键，执行相应的操作
          console.log('用户按下了回车键');
          var inputValue = inputElement.value;
          console.log('搜索内容为：' + inputValue);
          

            var searchResults = Yitizi.get(inputValue); // Call the get method on the Yitizi object
            var resultsDiv = document.getElementById("searchResults");
            resultsDiv.innerHTML = searchResults; // Set the search results as HTML 
          // 在这里添加你想要执行的操作
        }
      });
    });
    var img = document.getElementById('backButton');
    img.addEventListener('click', function () {
      window.history.back()
    });
    
    </script>

</body>
</html>

